<template>
    <el-dialog v-model="isShow" title="户型详情" width="80%" draggable align-center :destroy-on-close="true">
        <div>
            <component :is="components.get(currentComVal)" @priceChange="priceChange"></component>
        </div>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancel">取消</el-button>
                <el-button type="primary" @click="savePrice">
                    保存
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script lang="ts" setup>
import { reactive, ref, toRefs, defineAsyncComponent, computed, provide } from 'vue'
import { saveHousePriceApi } from '@/api/index/index'
import { ElMessage } from 'element-plus';
const props = defineProps({
    isShow: {
        type: Boolean,
        defaul: false
    },
    id: {
        type: Number,
        defaul: 0
    }
})
const emit = defineEmits(['close'])

// 需要加载的组件集合
const components = ref(new Map<string, any>())
components.value.set(
    'uploadHouse',
    defineAsyncComponent(() => import('./components/uploadhouse.vue'))
)
components.value.set(
    'myUpload',
    defineAsyncComponent(() => import('./components/myupload.vue'))
)
components.value.set(
    'myProfit',
    defineAsyncComponent(() => import('./components/myProfit.vue'))
)
components.value.set(
    'myfollow',
    defineAsyncComponent(() => import('./components/myFollow.vue'))
)
components.value.set(
    'myRelease',
    defineAsyncComponent(() => import('./components/myRelease.vue'))
)

const currentComVal = ref('uploadHouse')

const { isShow, id } = toRefs(props)
const saveHousePriceParams = ref({
    houseFileId: '',
    price: 0,
    vipPrice: 0
})
const cancel = () => {
    emit('close')
}
const savePrice = () => {
    if (saveHousePriceParams.value.price == 0 || saveHousePriceParams.value.vipPrice == 0) {
        ElMessage.warning('价格不能为空!')
    } else {
        saveHousePriceApi(saveHousePriceParams.value).then((res: any) => {
            if (res.status == 200) {
                saveHousePriceParams.value.price = 0
                saveHousePriceParams.value.vipPrice = 0
                ElMessage.success('保存成功')
                emit('close')
            }

        })
    }


}

const priceChange = (price: any) => {
    saveHousePriceParams.value = price
}
// watch(() => id?.value,
//     () => {
//         getHouseInfo()
//     })
provide('houseId', computed(() => {
    return id?.value
}))
</script>
<style scoped>
.diaSty {
    width: 100%;
    height: 25vh;
    background: #fff;
    border: 1px solid red;
}

.textSty {
    width: 400px;
    height: 200px;
    resize: none;
}

.dialog-footer button:first-child {
    margin-right: 10px;
}
</style>